<template>
  <div>
    <div class="item" v-for="(item, index) in props.fileList" :key="index">
      <div class="name">{{ item.name ?? item.fileName }}</div>
      <a-button
        type="link"
        @click="download(item.fileId || item.uuid || item.uid, item.fileName || item.name)"
      >
        下载
      </a-button>
    </div>
  </div>
</template>

<script setup lang="ts">
import api from "@/api"
import {utils} from "@/utils"
import {message} from "ant-design-vue"

interface FileData {
  name?: string,
  fileName?: string,
  fileId?: string,
  uuid?: string,
  uid?: string,
}

const props = defineProps<{ fileList: FileData[] | any }>()

function download(uuid: string, fileName: string): void {
  message.info('正在下载')
  api.downloadFile({uuid: uuid, fileName: fileName}).then(fileResp => {
    let blob = new Blob([fileResp.data])
    utils.downloadFile(blob, fileName)
  })
}
</script>

<style scoped lang="less">
.item {
  display: flex;
  align-items: center;
  //justify-content: space-around;
  margin-bottom: 5px;
}
.name {
  margin-right: 6%;
}
</style>
